<template>
  <a-card :bordered="false">
    <!-- 网上投标 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24"> </a-row>
      </a-form>
    </div>
    <div>
      <a-table
        ref="table"
        size="middle"
        :scroll="{ x: true }"
        bordered
        rowKey="bidSectionId"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="false"
        :loading="loading"
        class="j-table-force-nowrap"
        @change="handleTableChange"
      >
        <span slot="action" slot-scope="text, record">
          <a @click="doShowExplain(record)">缴费说明单</a>
        </span>
      </a-table>
    </div>

    <a-modal
      ref="refUploadModel"
      :title="'保证金缴费说明单'"
      :width="800"
      :visible="visible"
      :closable="true"
      :maskClosable="true"
      :footer="null"
      @cancel="close"
    >
      <!-- <a-form-model ref="form" :model="selectRow" slot="detail">
        <a-row>
          <a-col :span="8">
            <a-form-model-item label="标段名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
              {{ selectRow.bidSectionName }}
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="应收金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
              {{ selectRow.amount }}
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="收款账户" :labelCol="labelCol" :wrapperCol="wrapperCol"> 123123123</a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="截止时间" :labelCol="labelCol" :wrapperCol="wrapperCol"> </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model> -->
      <a-row >
        <a-col :span="24" style="line-height: 50px;"> 标段名称: {{ selectRow.bidSectionName }} </a-col>
        <a-col :span="8" style="line-height: 50px;"> 应收金额: {{ selectRow.amount }} </a-col>
        <a-col :span="8" style="line-height: 50px;"> 收款账户: 123 </a-col>
        <a-col :span="8" style="line-height: 50px;"> 截止时间: </a-col>
      </a-row>
    </a-modal>
  </a-card>
</template>

<script>
import '@assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { filterMultiDictText } from '@comp/dict/JDictSelectUtil'
import { getAction, postAction, deleteAction } from '@api/manage'

export default {
  name: 'xmtb',
  mixins: [JeecgListMixin, mixinDevice],
  components: {},
  data() {
    return {
      description: '费用缴纳指南',
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '标段编号',
          align: 'center',
          dataIndex: 'bidSectionCode',
        },
        {
          title: '标段名称',
          align: 'center',
          dataIndex: 'bidSectionName',
        },
        {
          title: '标段描述',
          align: 'center',
          dataIndex: 'bidSectionContent',
        },
        {
          title: '保证金',
          align: 'center',
          dataIndex: 'amount',
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed: 'right',
          width: 247,
          scopedSlots: { customRender: 'action' },
        },
      ],
      url: {
        list: '/exProject/exProject/queryExSectionByMainId?id=',
        queryByProjectId: '/exTender/exTenderList/queryExSectionByMainId?projectId=',
        exBondPaysituationByExSectionId: '/exBond/exBondPaysituation/queryByExSectionId?exSectionId=', //保证进缴纳情况
      },
      dictOptions: {},
      projectId: null,
      visible: false,
      selectRow: {
        bidSectionCode: '',
        bidSectionName: '',
        bidSectionContent: '',
        amount: '',
      },
      exBondPaysituationInfo: null, //
    }
  },
  created() {
    this.projectId = this.$route.query.projectId
    this.projectName = this.$route.query.projectName
    this.queryList()
    //初始化字典配置 在自己页面定义
    this.initDictConfig()
  },
  computed: {},
  methods: {
    doDownload(record) {
      this.doDownloadVisible = true
    },
    doShowExplain(record) {
      this.selectRow = Object.assign({}, record)
      getAction(this.url.exBondPaysituationByExSectionId + record.id)
        .then((res) => {
          if (res.success) {
            this.exBondPaysituationInfo = res.result
            this.visible = true
          } else {
            this.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    close() {
      this.visible = false
    },
    doShowResult() {
      //
      this.resultVisible = true
    },
    handleCancel() {
      this.resultVisible = false
    },
    queryList() {
      getAction(this.url.queryByProjectId + this.projectId)
        .then((res) => {
          if (res.success) {
            this.dataSource = res.result
          } else {
            this.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    initDictConfig() {},
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
